<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>详情页</title>
    <meta name="format-detection" content="telephone=yes"/>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <link rel="shortcut icon" href="/favicon.ico">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="/static/css/sm.min.css">
    <link rel="stylesheet" href="/static/css/sm-extend.min.css">

    <!--icon css-->
    <link rel="stylesheet" href="/static/css/icon-style.css">

    <style>
        .card {
            margin: 0rem;
        }

        .swiper-container {
            padding: 0 !important;
        }

        .tc {
            width: 100%;
            height: 2rem;
        }
    </style>
</head>

<body>
<header class="bar bar-nav">
    <a class="icon icon-circle-left pull-left" href="javascript:history.go(-1)"></a>
</header>
<hr/>
<!-- 内容区-->
<div class="content">
    <div class="card">

    </div>

    <div class="tc"></div>
</div>
<div class="bar bar-tab">

</div>

<script type='text/javascript' src='/static/lib/zepto/zepto.min.js' charset='utf-8'></script>
<script type='text/javascript' src='/static/js/sm.min.js' charset='utf-8'></script>
<script type='text/javascript' src='/static/js/sm-extend.min.js' charset='utf-8'></script>
<script type="text/javascript" src="/static/js/deatilPage.js" charset="utf-8"></script>
<script>
    $(document).ready(function () {
//			图片
        var url = location.search; //获取url中"?"符后的字串
        var strs = url.split("=");
        var id = strs[1];
        console.log(id);
        //商品详情异步函数
        $.ajax({
            url: '/sys/good/detail',
            type: 'get',
            data: {goodId: id},
            success: function (re) {
                if (!re.status) {
                    if(!re.data.GoodDetail.status) {//判断是否已下架或者售罄
                        var result1 = '';
                        var result2 = '';
                        var goodDetail = re.data.GoodDetail.data;
                        var sellerDetail = re.data.sellerCon.data;
                        //分割图片
                        var strs = new Array();
                        strs = goodDetail.goodImg.split(',');

                        result1 += "		<div class=\"card-content\">\n" +
                            "			<!-- 商品图片-->\n" +
                            "			<!-- Slider -->\n" +
                            "			<div class=\"swiper-container\" data-space-between='10'>\n" +
                            "				<div class=\"swiper-wrapper\">\n";
                        for (var i = 0; i < strs.length - 1; i++) {
                            result1 += "<div class=\"swiper-slide\"><img style='width: 100%;height: auto' src='" + strs[i] + "' alt=\"\"></div>\n";
                        }
                        result1 += "				</div>\n" +
                            "				<div class=\"swiper-pagination\">\n" +
                            "				</div>\n" +
                            "			</div>\n" +
                            "		</div>\n" +
                            "		<div class=\"card-header\">\n" +
                            "			<div class=\"item-media\" style=\"width: 70%\">\n" +
                            "				<img src='" + sellerDetail.img + "'style=\"width:2.2rem;border-radius: 5px;margin-right:0.5rem;float: left\">\n" +
                            "				<div class=\"item-title\" >\n" +
                            "					<span>" + sellerDetail.username + "</span><br>\n" +
                            "				</div>\n" +
                            "			</div>\n" +
                            "			<div class=\"item-inner\" >\n" +
                            "				<div class=\"item-after\" style=\"float: right\">\n" +
                            "					<span style=\"font-size: 1rem;font-weight: 800;color: red\">\n" +
                            "								￥" + goodDetail.price + "\n" +
                            "							</span><br>\n" +
                            "					<span style=\"font-size: .5rem;text-decoration:line-through;color: gray\">\n" +
                            "								￥" + goodDetail.oldPrice + "\n" +
                            "							</span>\n" +
                            "				</div>\n" +
                            "			</div>\n" +
                            "		</div>\n" +
                            "		<!-- 商品标题-->\n" +
                            "		<div class=\"card-content-inner\">" +
                            goodDetail.detail +
                            "		</div>";

                        $('.card').append(result1);
                        $(".swiper-container").swiper();

                        if (re.data.code == 2) {
                            result2 += "<div class=\"\" style=\"width: 100%;padding: 0 .5rem\">\n" +
                                "		<div class=\"button button-primary pull-left\" style=\"margin-right: .5rem\"\n" +
                                "			 onclick=\"unload() \">" +
                                "<span class=\"icon-star-empty\"></span>&nbsp;&nbsp;收藏\n" +
                                "        </div>\n" +
                                "		<div class=\" button button-primary pull-left\" style=\"margin-right: .5rem\">\n" +
                                "            <a href='javascript:void(0)' onclick='unload()'> <span class=\"icon-phone\"></span>&nbsp;&nbsp;联系</a>\n" +
                                "        </div>\n"+
                                "		<div class=\" button button-fill button-danger pull-right\" onclick='unload()' \n" +
                                "             style=\"height:1.8rem;line-height: 1.8rem;padding:0 1rem;font-size: .85rem\">\n" +
                                "            立即购买\n" +
                                "        </div>\n" +
                                "	</div>";
                        } else if (!re.data.isCollected.status) {
                            result2 +=
                                "<div class=\"\" style=\"width: 100%;padding: 0 .5rem\">\n" +
                                "		<div class=\"button button-primary pull-left\" style=\"margin-right: .5rem\"\n" +
                                "			 onclick=\"collect(this," + goodDetail.goodId + ") \">" +
                                "<span class=\"icon-star-full\"></span>&nbsp;&nbsp;取消收藏\n" +
                                "        </div>\n" +
                                "		<div class=\" button button-primary pull-left\" style=\"margin-right: .5rem\">\n" +
                                "            <a href='tel:" + sellerDetail.phone + "'> <span class=\"icon-phone\"></span>&nbsp;&nbsp;联系</a>\n" +
                                "        </div>\n"+
                                "		<div class=\" button button-fill button-danger pull-right\" onclick='createOrder("+goodDetail.goodId+")' \n" +
                                "             style=\"height:1.8rem;line-height: 1.8rem;padding:0 1rem;font-size: .85rem\">\n" +
                                "            立即购买\n" +
                                "        </div>\n" +
                                "	</div>";
                        } else {
                            result2 += "<div class=\"\" style=\"width: 100%;padding: 0 .5rem\">\n" +
                                "		<div class=\"button button-primary pull-left\" style=\"margin-right: .5rem\"\n" +
                                "			 onclick=\"collect(this," + goodDetail.goodId + ") \">" +
                                "<span class=\"icon-star-empty\"></span>&nbsp;&nbsp;收藏\n" +
                                "        </div>\n" +
                                "		<div class=\" button button-primary pull-left\" style=\"margin-right: .5rem\">\n" +
                                "            <a href='tel:" + sellerDetail.phone + "'> <span class=\"icon-phone\"></span>&nbsp;&nbsp;联系</a>\n" +
                                "        </div>\n"+
                                "		<div class=\" button button-fill button-danger pull-right\" onclick='createOrder("+goodDetail.goodId+")' \n" +
                                "             style=\"height:1.8rem;line-height: 1.8rem;padding:0 1rem;font-size: .85rem\">\n" +
                                "            立即购买\n" +
                                "        </div>\n" +
                                "	</div>";
                        }

                        $('.bar-tab').append(result2);
                    }else {
                        $.toast(re.data.GoodDetail.msg);
                        $('.content').append("<p class=\"text-center\">"+re.data.GoodDetail.msg+"</p>");
                    }
                } else {
                    $.toast(re.msg);
                }
            }
        });


    });
    //未登录提示
    function unload() {
        $.toast("请先登陆后再操作！")
    }
</script>
</body>

</html>